<template>
  <div class="adminbid">
    <div class="list">
      <!-- 搜索 -->
      <div class="search">
        <div class="search-item">
          <p>名称搜索</p>
          <el-input v-model="input" placeholder="名称或公司名称" />
        </div>
        <div class="search-item">
          <p style="margin-right: 9px">供应商类型</p>
          <el-select v-model="value" placeholder="请选择内容状态" size="large">
            <el-option key="0" label="全部" value="0" />
            <el-option key="1" label="发布中" value="1" />
            <el-option key="2" label="已完成" value="2" />
          </el-select>
        </div>
        <div class="search-item">
          <p style="margin-right: 9px">供应商行业</p>
          <el-select
            v-model="value"
            class="m-2"
            placeholder="请选择合同类型"
            size="large"
          >
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </div>
        <div class="search-item">
          <el-button type="primary">查询</el-button>
        </div>
        <div class="search-item">
          <el-button type="info">重置</el-button>
        </div>
      </div>
      <!-- 列表 -->
      <div class="suppliershow">
        <el-row :gutter="20">
          <el-col :span="6" v-for="item in 11" :key="item">
            <div class="supplierlist">
              <div class="supplierlist_content">
                <div class="supplierlistName">
                  <div>
                    <div>
                      <span class="name">姓名</span>
                      <span class="color999">职位</span>
                    </div>
                    <div style="margin-top: 10px">
                      <span class="color999">济南雷鸣网络</span>
                      <span class="color999" style="margin: 0 5px"> | </span>
                      <span class="color999"> 普通供应商</span>
                    </div>
                  </div>
                  <div>
                    <img src="../../assets/banner.png" alt="" class="img" />
                  </div>
                </div>
                <div class="telephone">
                  <div>
                    <el-icon class="el-icon"><PhoneFilled /></el-icon>
                    15729586098
                  </div>
                  <div>
                    <el-icon class="el-icon"><Message /></el-icon>
                    174958069287@163.com
                  </div>
                </div>
                <div>
                  <el-icon class="el-icon"><Location /></el-icon>
                  山东省济南市历下区解放路历东商务大厦
                </div>
                <div style="text-align: center">
                  <button class="button" @click="skippage">查看供应商</button>
                </div>
              </div>
            </div>
          </el-col>
        </el-row>
      </div>
      <!-- 分页 -->
      <div class="pages">
        <el-pagination :total="1000" background layout="prev, pager, next" />
      </div>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      input: "",
      value: "",
      options: [
        {
          value: "Option1",
          label: "Option1",
        },
        {
          value: "Option2",
          label: "Option2",
        },
        {
          value: "Option3",
          label: "Option3",
        },
        {
          value: "Option4",
          label: "Option4",
        },
        {
          value: "Option5",
          label: "Option5",
        },
      ],
    };
  },
  methods: {
    skippage() {
      this.$router.push("./supplierDetails");
    },
    // const handleSizeChange = (val: number) => {
    //   console.log(`${val} 每页条目数`);
    // };
    // const handleCurrentChange = (val: number) => {
    //   console.log(`当前页面: ${val}`);
    // };
  },
};
</script>



<style lang="scss" scoped>
@import "../../assets/scss/index.scss";
</style>
